@use 'src/styles/abstracts' as *;

.SearchBar {
  display: flex;
  width: toRem(415px);
  margin-bottom: toRem(14px);
  align-items: center;
  max-width: 100%;
  
  .MatchIcons {
    display: flex;
    align-items: baseline;
  }

  label {
    font-size: $text-md;
  }

  .MatchButton {
    margin-right: $space-xxs;
    &:last-child {
      margin-right: unset;
    }

    &:not(.active) {
      .Mui-disabled {
        color: $pico-30;
      }
    }
    &.active {
      .Icon__container {
        color: $primary-color;
      }
    }
    .Icon__container {
      font-size: $text-lg;
      color: $pico-80;
    }
  }
}
